<template>
	<div class="thePage flex-column">
		<!-- 被学生使用 -->
		<div class="pg-title60">实习企业登记</div>
		<div class="scroll list flex-column overflow-y">
			<div class="item-box flex-column" v-for="(item, i) in listData" :key="i">
				<div class="flex-between mb10">
					<div class="label">企业名称</div>
					<div :class="`status${item.status}`">{{ item.status == 1 ? '当前企业' : '过往企业' }}</div>
				</div>
				<div class="flex-between mb10">
					<div class="name">{{ item.entName }}</div>
					<div class="operator" v-if="item.status == 1" @click="onEdit(item)">
						<i class="iconfont icon-bianji"></i>
						变更
					</div>
				</div>
				<div class="update-dt">{{ item.dtUpdate }}</div>
			</div>
			<div class="btn-confirm" @click="onReturn">返回</div>
		</div>
	</div>
</template>

<script>
export default {
	name: 'EnterpriseList',
	data() {
		return {
			listData: [
				{
					entName: '甬港现代工程有限公司',
					status: 1,
					dtUpdate: '2020-7-28'
				},
				{
					entName: '甬港古代工程有限公司',
					status: 0,
					dtUpdate: '2020-7-02'
				},
				{
					entName: '甬港古代工程有限公司',
					status: 0,
					dtUpdate: '2020-7-02'
				},
				{
					entName: '甬港古代工程有限公司',
					status: 0,
					dtUpdate: '2020-7-02'
				},				
				{
					entName: '甬港古代工程有限公司',
					status: 0,
					dtUpdate: '2020-7-02'
				},
				{
					entName: '甬港古代工程有限公司',
					status: 0,
					dtUpdate: '2020-7-02'
				},
				{
					entName: '甬港古代工程有限公司',
					status: 0,
					dtUpdate: '2020-7-02'
				}
			]
		};
	},

	methods: {
		onEdit(item) {
			this.$router.push({ name: 'enterpriseEdit' });
		},

		onReturn() {
			this.$router.push({ name: 'studentHome' });
		}
	}
};
</script>

<style lang="less" scoped>
.scroll {
	.item-box {		
		color: #b0b0b0;
		.label {
			font-size: 12px;
		}
		.status1 {
			font-size: 11px;
			color: #ffb651;
		}
		.status0 {
			font-size: 11px;
		}
		.name {
			font-size: 15px;
			font-weight: bold;
			color: #3a3a3a;
		}
		.operator {
			width: 64px;
			background: #fe921e;
			border-radius: 10px;

			font-size: 12px;
			font-weight: 500;
			color: #ffffff;
			line-height: 22px;
			text-align: center;
			letter-spacing: 2px;
		}
		.update-dt {
			font-size: 10px;
		}
	}
}
.btn-confirm{
	margin: 20px auto;
}
</style>
